<template>
  <div class="userLayout">
    <a-row class="login" type="flex" justify="center">
      <a-col :span="6">
        <div class="header">
          <span class="title">星晓后台</span>
        </div>
        <a-form
          id="components-form-demo-normal-login"
          :form="form"
          class="login-form"
          @submit="handleSubmit"
        >
          <a-form-item>
            <a-input
              size="large"
              v-decorator="[
                'name',
                { rules: [{ required: true, message: '请输入用户名' }] },
              ]"
              placeholder="用户名"
            >
              <a-icon
                slot="prefix"
                type="user"
                style="color: rgba(0, 0, 0, 0.25)"
              />
            </a-input>
          </a-form-item>
          <a-form-item>
            <a-input
              size="large"
              v-decorator="[
                'password',
                { rules: [{ required: true, message: '请输入你的密码' }] },
              ]"
              type="password"
              placeholder="密码"
            >
              <a-icon
                slot="prefix"
                type="lock"
                style="color: rgba(0, 0, 0, 0.25)"
              />
            </a-input>
          </a-form-item>
          <a-form-item>
            <a-checkbox :checked="isRemember" @change="onRemember"
              >记住账号</a-checkbox
            >
            <!-- <a class="login-form-forgot" @click="goForget">忘记密码</a> -->
            <a-button
              size="large"
              type="primary"
              html-type="submit"
              class="login-form-button"
              :loading="iconLoading"
              >登录</a-button
            >
            <!-- <a @click="goRegister">注册账号</a> -->
          </a-form-item>
        </a-form>
      </a-col>
    </a-row>
  </div>
</template>
<script>
import JsEncrypt from "jsencrypt";
export default {
  metaInfo: {
    title: "后台",
  },
  data() {
    return {
      iconLoading: false,
      isRemember: true,
    };
  },
  beforeCreate() {
    this.form = this.$form.createForm(this);
  },
  mounted() {
    this.form.setFieldsValue({
      name: localStorage.getItem("account"),
    });
  },
  methods: {
    //加密
    code(name, password) {
      const url = "/Admin/Auth/getpubKey";
      const paramObj = {};
      this.$server.sl("GET", url, paramObj).then((res) => {
        // var publicKeys = res.pubKey;
        let encryptor = new JsEncrypt();
        let publicKey = res.pubKey;
        encryptor.setPublicKey(publicKey); // 设置公钥
        let rsaPassWord = encryptor.encrypt(password);
        const posturl = "/Admin/Auth/login";
        const postparamObj = {
          publicKey: publicKey,
          name: name,
          password: rsaPassWord,
        };
        this.$server.sl("POST", posturl, postparamObj).then((res) => {
          this.iconLoading = false;
          if (res.code == 1) {
            this.$message.success("登录成功", 3);
            this.$store.commit("updataname", res.data.name);
            this.$store.commit("updateuserid", res.data.aid);
            this.$store.commit("updatatoken", res.token);
            var token = localStorage.getItem("token");
            if (token != res.token) {
              localStorage.setItem("token", res.token);
            }
            localStorage.setItem("username", res.data.name);
            localStorage.setItem("userid", res.data.aid);
            localStorage.setItem("merchant_id", res.data.merchant_id);
            let data = JSON.stringify(res.data);
            localStorage.setItem("data", data);
            this.getSetting();
          } else {
            this.$message.error(res.msg, 3);
          }
        });
      });
    },
    //登录并设置userid和token
    handleSubmit(e) {
      e.preventDefault();
      this.form.validateFields((err, values) => {
        if (!err) {
          this.iconLoading = true;
          localStorage.setItem("account", values["name"]);
          this.code(values["name"], values["password"]);
        } else {
          this.$message.error("请重试");
        }
      });
    },
    //获取站点信息
    getSetting() {
      const url = "/Admin/Setting/getSettingInfo";
      const paramObj = {
        token: localStorage.getItem("token"),
      };
      this.$server.sl("GET", url, paramObj).then((res) => {
        if (res.code == 1) {
          var settingdata = JSON.stringify(res.data);
          localStorage.setItem("settingdata", settingdata);
          this.$router.push("/");
        } else if (res.code == 4001) {
          this.$router.push("/Auth/login");
          this.$message.warning("凭证失效，请重新登陆");
        } else {
          this.$message.warning("获取失败，请刷新重试");
        }
      });
    },
    //是否记住账号
    onRemember(e) {
      this.isRemember = e.target.checked;
    },
  },
};
</script>
<style scoped>
.userLayout {
  height: 100%;
  overflow: auto;
}
.login {
  background: #f0f2f5 url(../../assets/background.a568162c.svg) repeat 100%;
  background-size: 100% 100%;
  padding: 110px 0 144px;
  position: relative;
  height: 100%;
}
.login .header {
  height: 44px;
  line-height: 44px;
  text-align: center;
  margin-bottom: 30px;
}
.login .title {
  font-size: 33px;
  color: rgba(0, 0, 0, 0.85);
  font-weight: 600;
  position: relative;
  top: 2px;
}

#components-form-demo-normal-login .login-form {
  max-width: 300px;
}
#components-form-demo-normal-login .login-form-forgot {
  float: right;
}
#components-form-demo-normal-login .login-form-button {
  width: 100%;
}
</style>